<template>
    <div>
        <div v-if="menuList.length">
            <u-grid :col="5">
                <u-grid-item v-for="(item , index) in menuList" :key="index" @click="clickItem(item , index)">
                    <image style="width: 50px; height: 50px;" :src="item.thumbnailUrl" mode=""></image>
                    <view class="grid-text">{{item.name}}</view>
                </u-grid-item>
            </u-grid>
        </div>
    </div>
</template>
<script>

    import {TbStoreClassService} from "../../dev/services/tb-store-class.service";

    export default {
        data: function () {
            return {
                menuList: [],
            }
        },
        components: {},
        mounted() {
            const _self = this;
            new TbStoreClassService().findMenu({
                communityId: this.globalVariable.userInfo.tbCommunity.id,
                grade: 1,
                status: '1',
                deleted: 0,
            }).then(result => {
                console.log(result);
                _self.addMenuByIndex(result, _self.menuList, 0);
                console.log(_self.menuList);
                _self.menuList.forEach(item => {
                    if (item.thumbnailUrl) {
                        item.thumbnailUrl = item.thumbnailUrl + '?imageView2/1/w/100/h/100';
                    }
                });
                _self.menuList.push({
                    id: null,
                    name: '查看全部',
                    thumbnailUrl: '/static/icon/queryAll.png'  // todo 静态图片不能加参数?xxx=xxx否则在真机上显示不出来。
                });
                _self.$forceUpdate();
            });
        },
        methods: {
            addMenuByIndex(allList, list, index) {
                allList.forEach((parent, parentIndex) => {
                    parent.children.forEach((child, childIndex) => {
                        if (index === childIndex && list.length < 9) {
                            let parentCopy = JSON.parse(JSON.stringify(parent));
                            delete parentCopy.children;
                            child.parent = parentCopy;
                            list.push(child);
                        }
                    })
                });
                if (list.length < 9 && index < 9) {
                    this.addMenuByIndex(allList, list, index++);
                }
            },
            clickItem(item, index) {
                const _self = this;
                if (item.id) {
                    _self.navigateTo(`/pages/sub/sub1-tabs/tabs/goods-class/goods-class-filter/index`, null, {
                        parentStoreClass: item.parent,
                        tbStoreClass: item
                    });
                } else {
                    _self.switchTarBarByComponentRef('goodsClassRef');
                }
            }
        },
    }
</script>

<style lang="scss" scoped>
</style>
